<template>
	<div class="shi">
		<div class="header">
				<img src="../assets/rightbut.png">
				<span>支付失败</span>
		</div>
		<div class="content">
			<img src="../assets/shibai.png">
			<p class="shi">支付失败</p>
			<p class="xiang">详细订单信息请在友惠家APP查看</p>
			<a href="http://192.168.1.200:8089/#/invitedownload" class="xia">下载友惠家</a>
			<a href="#" class="fan">返回到详情</a>
			<p class="ling">京东VIP优惠券任你领</p>
			<p class="shou">快来友惠家手机客户端挑选</p>
		</div>
	</div>
</template>

<script>
</script>

<style scoped="scoped">
	html,body,.shi{
		width: 100%;
		height: 100%;
		background: #fff;
	}
	.header{
		width: 100%;
		height: 0.9rem;
		display: flex;
		align-items: center;
		padding: 0 0.5rem;
		border-bottom: 1px solid #E1E1E1;
	}
	.header img{
		width: 0.2rem;
		height: 0.3rem;
	}
	.header span{
		margin:  0 auto;
		color: #333333;
		font-size: 0.36rem;
		font-family: "PingFangSC-Medium";
	}
	.content{
		width: 100%;
		text-align: center;
	}
	.content img{
		margin-top: 1rem;
		width: 2rem;
		height: 2rem;
		margin-bottom: 0.6rem;
	}
	.shi{
		width: 100%;
		color: #333333 ;
		font-size: 0.4rem;
		font-family: "PingFangSC-Regular";
		line-height: 0.56rem;
	}
	.xiang{
		width: 100%;
		color: #888888 ;
		font-size: 0.28rem;
		line-height: 0.4rem;
		font-family: "PingFangSC-Regular";
		margin-bottom: 2.12rem;
	}
	.content a{
		height: 0.94rem;
		margin: 0.4rem 0.4rem;
		display: block;
		line-height: 0.94rem;
		text-align: center;
		border-radius: 0.1rem;
		font-size: 0.32rem;
	}
	.xia{
		background: #09BB07;
		color: #ffffff;
	}
	.fan{
		background: #F8F8F8;
		color: #000000;
	}
	.ling{
		margin-top: 2.47rem;
		font-size: 0.26rem;
		color: #576B95;
		line-height: 0.37rem;
	}
	.shou{
		font-size: 0.26rem;
		color: #576B95;
		line-height: 0.37rem;
		margin-bottom: 0.29rem;
	}
</style>